<%--
  Created by IntelliJ IDEA.
  User: 86180
  Date: 2021/2/5
  Time: 10:31
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>

<html class="app-ui">

<head>
    <!-- Meta -->
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />

    <!-- Document title -->
    <title>订单详情</title>

    <meta name="description" content="AppUI - Frontend Template & UI Framework" />
    <meta name="robots" content="noindex, nofollow" />
    <link rel="stylesheet" href="${pageContext.request.contextPath}/assets/css/bootstrap.min.css">
    <!-- Favicons -->
    <link rel="apple-touch-icon" href="${pageContext.request.contextPath}/assets/img/favicons/apple-touch-icon.png" />
    <link rel="icon" href="${pageContext.request.contextPath}/assets/img/favicons/favicon.ico" />

    <!-- AppUI CSS stylesheets -->
    <link rel="stylesheet" id="css-font-awesome" href="${pageContext.request.contextPath}/assets/css/font-awesome.css" />
    <link rel="stylesheet" id="css-ionicons" href="${pageContext.request.contextPath}/assets/css/ionicons.css" />
    <link rel="stylesheet" id="css-bootstrap" href="${pageContext.request.contextPath}/assets/css/bootstrap.css" />
    <link rel="stylesheet" id="css-app" href="${pageContext.request.contextPath}/assets/css/app.css" />
    <link rel="stylesheet" id="css-app-custom" href="${pageContext.request.contextPath}/assets/css/app-custom.css" />
    <!-- End Stylesheets -->
</head>
<body class="app-ui layout-has-fixed-header">
<div class="app-layout-canvas">
    <div class="app-layout-container">

        <!-- Header -->
        <header class="app-layout-header">
            <nav class="navbar navbar-default col-lg-offset-1">
                <div class="container-fluid">
                    <div class="navbar-header">
                        <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#header-navbar-collapse"
                                aria-expanded="false">
                            <span class="sr-only">Toggle navigation</span>
                            <span class="icon-bar"></span>
                            <span class="icon-bar"></span>
                            <span class="icon-bar"></span>
                        </button>
                        <button class="pull-left hidden-lg hidden-md navbar-toggle" type="button" data-toggle="layout" data-action="sidebar_toggle">
                            <span class="sr-only">Toggle drawer</span>
                            <span class="icon-bar"></span>
                            <span class="icon-bar"></span>
                            <span class="icon-bar"></span>
                        </button>
                        <a class="navbar-brand" href="javascript:void(0)">
                            <img class="img-responsive" src="${pageContext.request.contextPath}/assets/img/logo/logo-frontend.png" title="强强组合商城" alt="AppUI" />
                        </a>
                    </div>

                    <div class="collapse navbar-collapse" id="header-navbar-collapse">
                        <ul id="main-menu" class="nav navbar-nav navbar-left">

                            <li class="active">
                                <a href="${pageContext.request.contextPath}/jsp/home/frontend_home.jsp">首页</a>
                            </li>

                            <li>
                                <a href="frontend_about.html">关于</a>
                            </li>

                            <li>
                                <a href="frontend_pricing.html">Pricing</a>
                            </li>

                            <li>
                                <a href="frontend_team.html">Team</a>
                            </li>

                            <li class="dropdown">
                                <a href="#" data-toggle="dropdown">分类 <span class="caret"></span></a>
                                <ul class="dropdown-menu">

                                    <li>
                                        <a href="frontend_search.html">Search</a>
                                    </li>

                                    <li>
                                        <a href="frontend_support.html">Support</a>
                                    </li>

                                    <li>
                                        <a href="frontend_contact.html">Contact</a>
                                    </li>

                                    <li>
                                        <a href="frontend_login_signup.html">Login / Signup</a>
                                    </li>

                                    <li>
                                        <a href="frontend_400.html">Error 400</a>
                                    </li>

                                </ul>
                            </li>

                        </ul>
                        <!-- .navbar-left -->

                        <ul class="nav navbar-nav navbar-right navbar-toolbar hidden-sm hidden-xs w-30">
                            <li class="active" id="business">
                                <a href="frontend_home.html">注册为商家</a>
                            </li>
                            <li class="active" id="deliver">
                                <a href="frontend_home.html">注册为配送员</a>
                            </li>
                            <li class="dropdown">
                                <a href="javascript:void(0)" data-toggle="dropdown"><i class="ion-ios-bell"></i> <span class="badge">3</span></a>
                                <ul class="dropdown-menu dropdown-menu-right">
                                    <li class="dropdown-header">消息</li>
                                    <li>
                                        <a tabindex="-1" href="javascript:void(0)"><span class="badge pull-right">3</span> 有无内鬼？ </a>
                                    </li>
                                    <li>
                                        <a tabindex="-1" href="javascript:void(0)"><span class="badge pull-right">1</span> 不过如此 </a>
                                    </li>
                                    <li class="divider"></li>
                                    <li class="dropdown-header">公告</li>
                                    <li>
                                        <a tabindex="-1" href="javascript:void(0)">登dua郎..</a>
                                    </li>
                                </ul>
                            </li>

                            <li class="dropdown dropdown-profile">
                                <a href="javascript:void(0)" data-toggle="dropdown">
                                    <span class="m-r-sm">${account.accName}<span class="caret"></span></span>
                                    <img class="img-avatar img-avatar-48" src="${pageContext.request.contextPath}/file/acc/${account.accImg == null?"000000011612245316757212.png":account.accImg}" alt="User profile pic" />
                                </a>
                                <ul class="dropdown-menu dropdown-menu-right">
                                    <li>
                                        <a href="${pageContext.request.contextPath}/jsp/MyAccount/MyMoneyRecord.jsp">个人账户</a>
                                    </li>
                                    <li>
                                        <a href="${pageContext.request.contextPath}/jsp/MyAccount/myBuyCart.jsp">我的购物车</a>
                                    </li>
                                    <li>
                                        <a href="#" id="logout">退出</a>
                                    </li>
                                </ul>
                            </li>
                        </ul>
                        <!-- .navbar-right -->
                    </div>
                </div>
                <!-- .container-fluid -->
            </nav>
            <!-- .navbar -->
        </header>
        <main class="app-layout-content">

            <!-- Page Content -->
            <div class="container-fluid p-y-md">
                <!-- Forms Row -->
                <div class="row">
                    <div class="card col-lg-8 col-md-offset-2">
                        <!-- Material Forms Validation -->
                        <div class="card">
                            <div class="card-head col-md-12 text-center">
                                <h4>评价宝贝</h4>
                                <hr />
                            </div>
                            <div class="col-md-12 card-block">
                                <form class="form-horizontal m-t-sm" id="opinionSubmit" action="" method="post">
                                    <div class="col-md-3">
                                        <img class="img-responsive" id="goodsImgSrc" src="${pageContext.request.contextPath}/assets/img/misc/frontend_about1.png" style="width: 190px;height: 150px;"
                                             alt="User profile pic" />
                                        <br />
                                        <p class="font-500 m-b-0 text-center"><span id="goNm">iPhone 9999x</span></p>
                                        <p class="hidden-xs"><span id="goDp">买到就是赚到！！！最新残次品，逼真仿造</span></p>
                                    </div>
                                    <div class="col-md-8">
                                        <div class="row text-center">
                                            <div class="radio">
                                                <label class="css-input css-radio css-radio-lg css-radio-default m-r-sm">
                                                    <input type="radio" class="opinionType" name="opinionType" checked="" value="1"><span></span> 好评
                                                </label>
                                                <label class="css-input css-radio css-radio-lg css-radio-default m-r-sm">
                                                    <input type="radio" class="opinionType" name="opinionType" value="2"><span></span> 中评
                                                </label>
                                                <label class="css-input css-radio css-radio-lg css-radio-default m-r-sm">
                                                    <input type="radio" class="opinionType" name="opinionType" value="3"><span></span> 差评
                                                </label>
                                            </div>
                                        </div>
                                        <br />
                                        <div class="col-md-12">
                                            <textarea class="form-control" id="example-textarea-input" name="example-textarea-input" rows="6" placeholder="说说你的看法吧.."></textarea>
                                        </div>

                                    </div>
                                    <div class="form-group m-b-0 row">
                                        <div class="col-md-8 col-md-offset-4">
                                            <div class="col-md-6">
                                                <a class="btn btn-app addOpinionImg" lay-event="no"  style="width: 100px;"><i class="fa fa-camera"></i></a>
                                            </div>
                                            <div class="col-md-6">
                                                <button class="btn btn-app" type="submit" style="width: 100px;">提交</button>
                                            </div>
                                        </div>
                                    </div>
                                </form>
                            </div>
                            <!-- .card-block -->
                        </div>
                        <!-- .card -->
                        <!-- End Material Forms Validation -->
                    </div>
                    <!-- .col-lg-6 -->

                </div>
                <!-- .row -->
                <!-- End Forms Row -->


            </div>
            <!-- End Page Content -->

        </main>


        <footer class="app-layout-footer">
            <!-- .section -->

            <div class="section p-y-xl bg-app bg-inverse">
                <div class="container text-center">
                    <!-- .row -->
                    <div class="row p-t-md p-b-lg">
                        <div class="col-md-10 col-md-offset-1">
                        </div>
                    </div>
                    <!-- .row -->
                </div>
                <!-- .container -->
            </div>
            <!-- .section -->
        </footer>

    </div>
    <!-- .app-layout-container -->
</div>

<!-- AppUI Core JS: jQuery, Bootstrap, slimScroll, scrollLock and App.js -->
<script src="${pageContext.request.contextPath}/assets/js/core/jquery.min.js"></script>
<script src="${pageContext.request.contextPath}/assets/js/core/bootstrap.min.js"></script>
<script src="${pageContext.request.contextPath}/assets/js/core/jquery.slimscroll.min.js"></script>
<script src="${pageContext.request.contextPath}/assets/js/core/jquery.scrollLock.min.js"></script>
<script src="${pageContext.request.contextPath}/assets/js/core/jquery.placeholder.min.js"></script>
<script src="${pageContext.request.contextPath}/assets/js/app.js"></script>
<script src="${pageContext.request.contextPath}/assets/js/app-custom.js"></script>
<script src="${pageContext.request.contextPath}/js/layui/layui.js"></script>
<script type="text/javascript">
    $(function (){
        var accId = ${account.accId};
        var isOpini = "${param.isOpini}";
        var isOpinis = isOpini.split(",");
        var detId = isOpinis[0];
        var goId = isOpinis[1];
        var opiId = -1;
        var goNm;
        insertOpinion();//创建空评价
        getGoodsInfo();//获得商品信息
        function getGoodsInfo() {
            var url = "${pageContext.request.contextPath}/goods/selectGoodsByGoId";
            var parm = {
                goId:goId
            };
            $.get(url,parm,function (data) {
                if (data.code == 1001){
                    $("#goodsImgSrc").attr("src","${pageContext.request.contextPath}/file/goodsInfo/"+data.goods.imgUrl);
                    $("#goNm").html(data.goods.goNm);
                    goNm = data.goods.goNm;
                    $("#goDp").html(data.goods.goDp);
                }
            });
        }
        function insertOpinion(){
            var url = "${pageContext.request.contextPath}/accountInfo/opinionGoods";
            var param = {
                opiId:"",
                detId:detId,
                goId:"",
                goNm:"",
                accId:"",
                opiType:"",
                opiContent:""
            };
            $.post(url,param,function (data) {
                if (data.code == 1001) {
                    opiId = data.opiId;
                }
            });
        }

        //评价提交
        $("#opinionSubmit").submit(function (event) {
            event.preventDefault();
            var opiContent = $("#example-textarea-input").val();
            var opinionType = $(".opinionType");
            var opiType;
            for (var i = 0; i < opinionType.length; i++) {
                if ($(opinionType[i]).prop("checked") == true){
                    opiType = $(opinionType[i]).val();
                }
            }
            var url = "${pageContext.request.contextPath}/accountInfo/opinionGoods";
            var param = {
                opiId:opiId,
                detId:detId,
                goId:goId,
                goNm:goNm,
                accId:accId,
                opiType:opiType,
                opiContent:opiContent
            };
            $.post(url,param,function (data) {
                if (data.code == 1001){
                    alert("评价成功");
                    window.location.href = "${pageContext.request.contextPath}/jsp/MyAccount/myOrder.jsp";
                }
            })
        });
        layui.use(['form', 'layedit', 'laydate'], function() {
            var form = layui.form
                , layer = layui.layer;

            $(".addOpinionImg").click(function () {
                layer.open({
                    type: 2,//设置弹窗类型为2，表示弹出一个页面
                    title: '添加图片',//弹窗标题
                    skin: 'layui-layer-rim',//加上边框
                    area: ['600px', '550px '],//设置弹窗的宽高
                    content: 'opinionImgUpload.jsp?opiId='+opiId //以弹出层的形式跳转到 评价图片页面，并附带参数
                });

            });
        })

        /*动态显示首页头部*/
        var role = ${account.role};
        if(role == 2){
            $("#business").html("<a href='../business/UnFinishOrder.jsp'>商家后台</a>");
            $("#deliver").html("");
        }
        if(role == 3){
            $("#business").html("");
            $("#deliver").html("<a href='#'>配送员后台</a>");
        }
        /*退出登录*/
        $("#logout").click(function (event){
            event.preventDefault();
            var url = "/login/logoutShop";
            $.post(url,function (){
                window.location.href = "../../login.jsp";
            })
        })


    });

</script>
</body>
</html>

